<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/axios.min.js"></script>
    <script src="js/query.js"></script>

    <script>
        var productId;
        window.onload = function () {
            //得到从前一页面提交的商品ID
            productId = getQuery("id");
            findProduct();
        }

        function findProduct() {
            axios.get("/product/findById", {
                params: {
                    id: productId
                }
            }).then(resp => {
                var info = resp.data;
                $("productImg").src = "/img/product/" + info.imgPath;
                $("nameSpan").innerHTML = info.name;
                $("priceSpan").innerHTML = info.price;
                $('speakNumSpan').innerHTML = info.speakNum;

                this.fullTable(info.speakList);
            })
        }

        /**
         * 填充评论表格
         * @param speakList
         */
        function fullTable(speakList) {
            var str = "";
            speakList.forEach(n => {
                str += `<tr><td>${n.user.nickName}</td><td>${n.content}</td></tr>`;
            });
            $("data").innerHTML = str;
        }

        /**
         * 添加评论
         */
        function addSpeak() {
            axios.get("/speak/add", {
                params: {
                    productId,
                    content: $("content").value
                }
            }).then(resp => {
                var info = resp.data;
                if (info == "noland") {
                    location.href="/login.html?errorInfo=noland";
                }else{
                    fullTable(resp.data);
                }
            });
        }
    </script>
</head>
<body>
<div>
    <img src="" id="productImg" width="200" height="200"><br>
    商品名：<span id="nameSpan"></span><br>
    单价：<span id="priceSpan"></span><br>
    评论：<span id="speakNumSpan"></span><br>

    <table width="50%" border="1">
        <tbody id="data"></tbody>
    </table>

    请输入评价<input type="text" id="content">
    <input type="button" value="评论" onclick="addSpeak()">
</div>
</body>
</html>